<template>
    <!-- 办事指南 -->
    <div class="app-container">
        <div class="baAdd">
            <div class="baAddLeft">
                <!-- <el-steps direction="vertical" :active="stepActive">
                    <el-step title="基础信息" @click="scrollCS('basic1')"></el-step>
                    <el-step title="建筑垃圾处理方案" @click="scrollCS('basic2')"></el-step>
                    <el-step title="运输管理措施" @click="scrollCS('basic3')"></el-step>
                    <el-step title="附件上传" @click="scrollCS('basic4')"></el-step>
                </el-steps> -->
                <div class="baAddSteps">
                    <div :class="stepActive == 1?'isActive':''" class="baAddStep" @click="scrollCS('basic1', 1)">基础信息</div>
                    <div :class="stepActive == 2?'isActive':''" class="baAddStep" @click="scrollCS('basic2', 2)">建筑垃圾处理方案</div>
                    <div :class="stepActive == 3?'isActive':''" class="baAddStep" @click="scrollCS('basic3', 3)">运输管理措施</div>
                    <div :class="stepActive == 4?'isActive':''" class="baAddStep" @click="scrollCS('basic4', 4)">附件上传</div>
                </div>
            </div>
            <div class="baAddRight" ref="basicAll">
                <div class="baAddRightBasic" ref="basic1">
                    <div class="basicCell">
                        <div class="basicCellTitle">基础信息填报</div>
                        <el-form ref="formBasic" :model="formData" :rules="rulesBasic" label-width="150px">
                            
                            <div class="basicSubtitle">项目信息</div>
                            <el-row>
                                <el-col :span="8">
                                    <el-form-item label="工程名称" prop="name">
                                        <el-input v-model="formData.name" placeholder="请输入工程名称" />
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                <el-form-item label="工程类别" prop="typeGC">
                                    <el-select class="fillUp" v-model="formData.typeGC" clearable placeholder="请选择工程类别">
                                        <el-option
                                            v-for="(v,i) in typeList"
                                            :key="i"
                                            :label="v.label"
                                            :value="v.value"
                                        ></el-option>
                                    </el-select>
                                </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="工程地址" prop="gcdz">
                                        <el-input v-model="formData.gcdz" placeholder="请输入工程地址" />
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="工程规模(㎡)" prop="gcgm">
                                        <el-input v-model="formData.gcgm" placeholder="请输入工程规模" />
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="开工时间" prop="kgsj">
                                        <el-date-picker v-model="formData.kgsj" type="date" placeholder="选择开工时间"> </el-date-picker>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="竣工时间" prop="jgsj">
                                        <el-date-picker v-model="formData.jgsj" type="date" placeholder="选择竣工时间"> </el-date-picker>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="项目级别" prop="xmjb">
                                        <el-select class="fillUp" v-model="formData.xmjb" clearable placeholder="请选择项目级别">
                                            <el-option
                                                v-for="(v,i) in xmjbList"
                                                :key="i"
                                                :label="v.label"
                                                :value="v.value"
                                            ></el-option>
                                        </el-select>
                                        <!-- <el-input v-model="formData.constructionUnit" placeholder="请输入建设单位" /> -->
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="所属市" prop="cityCode">
                                        <template slot="label">
                                            <span>所属市</span><el-popover
                                                placement="bottom"
                                                width="400"
                                                trigger="hover">
                                                <div>
                                                    <div>当前备案信息管辖区域</div>
                                                </div>
                                                <i slot="reference" class="el-icon-question" style="font-size: 16px; margin-left: 5px;"></i>
                                                <!-- <el-button >click 激活</el-button> -->
                                            </el-popover>
                                        </template>
                                        <el-select class="fillUp" v-model="formData.cityCode" clearable placeholder="请选择所属市" @change="initAreaList">
                                            <el-option
                                                v-for="(v,i) in cityList"
                                                :key="i"
                                                :label="v.cityName"
                                                :value="v.cityCode"
                                            ></el-option>
                                        </el-select>
                                        <!-- <el-input v-model="formData.constructionUnit" placeholder="请输入建设单位" /> -->
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="所属区/县" prop="areaCode">
                                    
                                        <template slot="label">
                                            <span>所属区/县</span>
                                            <el-popover
                                                placement="bottom"
                                                width="400"
                                                trigger="hover">
                                                <div>
                                                    <div>当前备案信息管辖区域</div>
                                                </div>
                                                <i slot="reference" class="el-icon-question" style="font-size: 16px; margin-left: 5px;"></i>
                                                <!-- <el-button >click 激活</el-button> -->
                                            </el-popover>
                                        </template>
                                        <el-select class="fillUp" v-model="formData.areaCode" clearable placeholder="请选择所属区/县">
                                            <el-option
                                                v-for="(v,i) in areaList"
                                                :key="i"
                                                :label="v.areaName"
                                                :value="v.areaCode"
                                            ></el-option>
                                        </el-select>
                                        <!-- <el-input v-model="formData.constructionUnit" placeholder="请输入建设单位" /> -->
                                    </el-form-item>
                                </el-col>
                            </el-row>
                            <div class="basicSubtitle">施工单位信息</div>
                            <el-row>
                                <el-col :span="8">
                                <el-form-item label="施工单位" prop="sgdw">
                                    <el-input v-model="formData.sgdw" placeholder="请输入施工单位" />
                                </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                <el-form-item label="单位类型" prop="dwlx">
                                    <el-select class="fillUp" v-model="formData.dwlx" clearable placeholder="请选择单位类型">
                                        <el-option
                                            v-for="(v,i) in typeList"
                                            :key="i"
                                            :label="v.label"
                                            :value="v.value"
                                        ></el-option>
                                    </el-select>
                                </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="申请人" prop="sqr">
                                        <el-input v-model="formData.sqr" placeholder="请输入申请人" />
                                    </el-form-item>
                                </el-col>
                                <!-- <el-col :span="8">
                                    <el-form-item label="单位负责人" prop="constructionUnit">
                                        <el-input v-model="formData.constructionUnit" placeholder="请输入建设单位" />
                                    </el-form-item>
                                </el-col> -->
                                <el-col :span="8">
                                    <el-form-item label="申请人联系电话" prop="sqrlxdh">
                                        <el-input v-model="formData.sqrlxdh" placeholder="请输入申请人联系电话" />
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="社会信用代码" prop="shxydm">
                                        <el-input v-model="formData.shxydm" placeholder="请输入社会信用代码" />
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="施工单位负责人" prop="sgdwfzr">
                                        <el-input v-model="formData.sgdwfzr" placeholder="请输入施工单位负责人" />
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="工地负责人联系电话" prop="gdfzrlxdh">
                                        <el-input v-model="formData.gdfzrlxdh" placeholder="请输入工地负责人联系电话" />
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="建筑垃圾处理负责人" prop="jzljclfzr">
                                        <el-input v-model="formData.jzljclfzr" placeholder="请输入建筑垃圾处理负责人" />
                                    </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="垃圾负责人联系电话" prop="ljfzrdh">
                                        <el-input v-model="formData.ljfzrdh" placeholder="请输入垃圾负责人联系电话" />
                                    </el-form-item>
                                </el-col>
                                
                            </el-row>
                            <div class="basicSubtitle">建设单位信息</div>
                            <el-row>
                                <el-col :span="8">
                                <el-form-item label="单位名称" prop="dwmc">
                                    <el-input v-model="formData.dwmc" placeholder="请输入单位名称" />
                                </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                <el-form-item label="负责人" prop="dwfzr">
                                    <el-input v-model="formData.dwfzr" placeholder="请输入负责人" />
                                </el-form-item>
                                </el-col>
                                <el-col :span="8">
                                    <el-form-item label="联系电话" prop="dwfzrdh">
                                        <el-input v-model="formData.dwfzrdh" placeholder="请输入联系电话" />
                                    </el-form-item>
                                </el-col>
                            </el-row>
                            
                            <!-- <div class="basicSubtitle">项目位置</div>
                            <div class="basicFence">

                            </div> -->
                        </el-form>
                    </div>
                </div>
                <div class="baAddRightBasic" ref="basic2">
                    <div class="basicCell">
                        <div class="basicCellTitle">建筑垃圾处理方案</div>
                        
                        <el-form ref="formWeightInfo" :model="formData" :rules="rulesWeightInfo" label-width="150px">
                            <el-row>
                                <el-col :span="10">
                                    <el-form-item label="产生总量（t）:" prop="totalAllCount">
                                        <el-input v-model="formData.totalAllCount" placeholder="请输入,保留小数点后两位；" />
                                    </el-form-item>
                                </el-col>
                            </el-row>
                            <div class="basicSubtitle">工程渣土</div>
                            <el-row>
                                <el-col :span="10">
                                    <el-form-item label="产生总量（t）:" prop="name">
                                        <!-- <el-input readOnly v-model="residueWeightInfoTotal" /> -->
                                        <el-input v-model="formData.residueWeightInfoTotal" placeholder="请输入,保留小数点后两位" />
                                    </el-form-item>
                                </el-col>
                            </el-row>
                            <div v-for="(item, index1) in formData.residueWeightInfoList" :key="`1-${index1}`">
                                <el-row>
                                    <el-col :span="10">
                                        <el-form-item :label="item.disposalTypeDesc + '量(t):'" :prop="'residueWeightInfoList.' + index1 + '.weight'" :rules="rulesWeightInfo.weight">
                                        <!-- <el-form-item :label="item.disposalTypeDesc + '量(t):'" :prop="item.weight" :rules="rulesWeightInfo.weight"> -->
                                            <!-- <el-form-item :label="item.disposalTypeDesc + '量(t):'" prop="weight"> -->
                                            <el-input v-model="item.weight" type="number" placeholder="请输入,保留小数点后两位" />
                                        </el-form-item>
                                    </el-col>
                                    <el-col :span="10">
                                        <!-- <el-form-item :label="item.disposalTypeDesc + '地点：'" :prop="item.constructionFactoryId" :rules="rulesWeightInfo.constructionFactoryId"> -->
                                            <el-form-item :label="item.disposalTypeDesc + '地点：'" :prop="'residueWeightInfoList.' + index1 + '.constructionFactoryId'" :rules="rulesWeightInfo.constructionFactoryId">
                                            <el-select class="fillUp" v-model="item.constructionFactoryId" clearable placeholder="请选择">
                                                <el-option
                                                    v-for="(item,inx) in placeList"
                                                    :key="inx"
                                                    :label="item.label"
                                                    :value="item.value"
                                                ></el-option>
                                            </el-select>
                                        </el-form-item>
                                    </el-col>
                                    
                                    <el-col :span="4" style="padding: 0 10px;">
                                        <el-button icon="el-icon-plus" circle @click="addResidue(item, index1, 'residueWeightInfoList')"></el-button>
                                        <el-button icon="el-icon-minus" v-if="index1>2" circle @click="delResidue(item, index1, 'residueWeightInfoList')"></el-button>
                                    </el-col>
                                </el-row>
                            </div>
                            <div class="basicSubtitle">工程泥浆</div>
                            <el-row>
                                <el-col :span="10">
                                    <el-form-item label="产生总量（t）:" prop="name">
                                        <el-input v-model="formData.residueWeightInfoTotal2" placeholder="请输入,保留小数点后两位" />
                                    </el-form-item>
                                </el-col>
                            </el-row>
                            <div v-for="(item, index2) in formData.residueWeightInfoList2" :key="`2-${index2}`">
                                <el-row>
                                    <el-col :span="10">
                                        <el-form-item :label="item.disposalTypeDesc + '量(t):'" :prop="'residueWeightInfoList2.' + index2 + '.weight'" :rules="rulesWeightInfo.weight">
                                        <!-- <el-form-item :label="item.disposalTypeDesc + '量(t):'" :prop="item.weight" :rules="rulesWeightInfo.weight"> -->
                                            <!-- <el-form-item :label="item.disposalTypeDesc + '量(t):'" prop="weight"> -->
                                            <el-input v-model="item.weight" placeholder="请输入,保留小数点后两位" />
                                        </el-form-item>
                                    </el-col>
                                    <el-col :span="10">
                                        <!-- <el-form-item :label="item.disposalTypeDesc + '地点：'" :prop="item.constructionFactoryId" :rules="rulesWeightInfo.constructionFactoryId"> -->
                                            <el-form-item :label="item.disposalTypeDesc + '地点：'" :prop="'residueWeightInfoList2.' + index2 + '.constructionFactoryId'" :rules="rulesWeightInfo.constructionFactoryId">
                                            <el-select class="fillUp" v-model="item.constructionFactoryId" clearable placeholder="请选择">
                                                <el-option
                                                    v-for="(item,k) in placeList"
                                                    :key="k"
                                                    :label="item.label"
                                                    :value="item.value"
                                                ></el-option>
                                            </el-select>
                                        </el-form-item>
                                    </el-col>
                                    
                                    <el-col :span="4" style="padding: 0 10px;">
                                        <el-button icon="el-icon-plus" circle @click="addResidue(item, index2, 'residueWeightInfoList2')"></el-button>
                                        <el-button icon="el-icon-minus" v-if="index2>1" circle @click="delResidue(item, index2, 'residueWeightInfoList2')"></el-button>
                                    </el-col>
                                </el-row>
                            </div>
                            <div class="basicSubtitle">拆除垃圾</div>
                            <el-row>
                                <el-col :span="10">
                                    <el-form-item label="产生总量（t）:" prop="name">
                                        <el-input v-model="formData.residueWeightInfoTotal3" placeholder="请输入,保留小数点后两位" />
                                    </el-form-item>
                                </el-col>
                            </el-row>
                            <div v-for="(item, index3) in formData.residueWeightInfoList3" :key="`3-${index3}`">
                                <el-row>
                                    <el-col :span="10">
                                        <el-form-item :label="item.disposalTypeDesc + '量(t):'" :prop="'residueWeightInfoList3.' + index3 + '.weight'" :rules="rulesWeightInfo.weight">
                                        <!-- <el-form-item :label="item.disposalTypeDesc + '量(t):'" :prop="item.weight" :rules="rulesWeightInfo.weight"> -->
                                            <!-- <el-form-item :label="item.disposalTypeDesc + '量(t):'" prop="weight"> -->
                                            <el-input v-model="item.weight" placeholder="请输入,保留小数点后两位" />
                                        </el-form-item>
                                    </el-col>
                                    <el-col :span="10">
                                        <!-- <el-form-item :label="item.disposalTypeDesc + '地点：'" :prop="item.constructionFactoryId" :rules="rulesWeightInfo.constructionFactoryId"> -->
                                            <el-form-item :label="item.disposalTypeDesc + '地点：'" :prop="'residueWeightInfoList3.' + index3 + '.constructionFactoryId'" :rules="rulesWeightInfo.constructionFactoryId">
                                            <el-select class="fillUp" v-model="item.constructionFactoryId" clearable placeholder="请选择">
                                                <el-option
                                                    v-for="(item,j) in placeList"
                                                    :key="j"
                                                    :label="item.label"
                                                    :value="item.value"
                                                ></el-option>
                                            </el-select>
                                        </el-form-item>
                                    </el-col>
                                    
                                    <el-col :span="4" style="padding: 0 10px;">
                                        <el-button icon="el-icon-plus" circle @click="addResidue(item, index3, 'residueWeightInfoList3')"></el-button>
                                        <el-button icon="el-icon-minus" v-if="index3>1" circle @click="delResidue(item, index3, 'residueWeightInfoList3')"></el-button>
                                    </el-col>
                                </el-row>
                            </div>
                            <div class="basicSubtitle">装修垃圾</div>
                            <el-row>
                                <el-col :span="10">
                                    <el-form-item label="产生总量（t）:" prop="name">
                                        <el-input v-model="formData.residueWeightInfoTotal4" placeholder="请输入,保留小数点后两位" />
                                    </el-form-item>
                                </el-col>
                            </el-row>
                            <div v-for="(item, index4) in formData.residueWeightInfoList4" :key="`4-${index4}`">
                                <el-row>
                                    <el-col :span="10">
                                        <el-form-item :label="item.disposalTypeDesc + '量(t):'" :prop="'residueWeightInfoList4.' + index4 + '.weight'" :rules="rulesWeightInfo.weight">
                                        <!-- <el-form-item :label="item.disposalTypeDesc + '量(t):'" :prop="item.weight" :rules="rulesWeightInfo.weight"> -->
                                            <!-- <el-form-item :label="item.disposalTypeDesc + '量(t):'" prop="weight"> -->
                                            <el-input v-model="item.weight" placeholder="请输入,保留小数点后两位" />
                                        </el-form-item>
                                    </el-col>
                                    <el-col :span="10">
                                        <!-- <el-form-item :label="item.disposalTypeDesc + '地点：'" :prop="item.constructionFactoryId" :rules="rulesWeightInfo.constructionFactoryId"> -->
                                            <el-form-item :label="item.disposalTypeDesc + '地点：'" :prop="'residueWeightInfoList4.' + index4 + '.constructionFactoryId'" :rules="rulesWeightInfo.constructionFactoryId">
                                            <el-select class="fillUp" v-model="item.constructionFactoryId" clearable placeholder="请选择">
                                                <el-option
                                                    v-for="(item,inx) in placeList"
                                                    :key="inx"
                                                    :label="item.label"
                                                    :value="item.value"
                                                ></el-option>
                                            </el-select>
                                        </el-form-item>
                                    </el-col>
                                    
                                    <el-col :span="4" style="padding: 0 10px;">
                                        <el-button icon="el-icon-plus" circle @click="addResidue(item, index4, 'residueWeightInfoList4')"></el-button>
                                        <el-button icon="el-icon-minus" v-if="index4>1" circle @click="delResidue(item, index4, 'residueWeightInfoList4')"></el-button>
                                    </el-col>
                                </el-row>
                            </div>
                            
                            
                            <!-- <el-button @click="aa"> 校验 </el-button> -->
                        </el-form>
                    </div>
                </div>
                <div class="baAddRightBasic" ref="basic3">
                    <div class="basicCell">
                        <div class="basicCellTitle">运输管理措施</div>
                        

                            <div class="basicSubtitle">
                                <el-button type="primary" @click="addTrans">新增</el-button>
                            </div>
                            
                                <el-table border fit empty-text="暂无数据" :data="formData.tableDataTrans">
                                    <el-table-column label="运输公司名称" align="center" prop="nameGS" />
                                    <el-table-column label="负责人" align="center" prop="userName" />
                                    <el-table-column label="联系电话" align="center" prop="phone"/>
                                    <!-- <el-table-column label="运输路线" align="center" prop="areaName" width="80" /> -->
                                    <el-table-column label="车辆信息" align="center" prop="carInfor" />
                                    <el-table-column label="操作" align="center" fixed="right" class-name="small-padding fixed-width" >
                                        <template slot-scope="scope">
                                        <el-button size="mini" type="text" icon="el-icon-edit" @click="updateTrans(scope.row, scope.$index)" >修改</el-button>
                                        <el-button size="mini" type="text" icon="el-icon-delete" @click="deleteTrans(scope.row, scope.$index)" >删除</el-button>
                                        </template>
                                    </el-table-column>
                                </el-table>
                        
                        <el-dialog :title="titleTrans" :visible.sync="openTrans" width="800px" :close-on-click-modal="false">
                            <el-form class="alertForm" ref="formCompany" :model="formDataTrans" :rules="rulesTrans" label-width="120px">
                                <el-row>
                                    <el-col :span="12">
                                    <el-form-item label="运输公司名称" prop="nameGS">
                                        <!-- <el-input v-model="formDataTrans.nameGS" placeholder="请输入工地名称" /> -->
                                        <el-select class="fillUp" v-model="formDataTrans.nameGS"  clearable placeholder="请选择运输公司名称">
                                                <el-option
                                                    v-for="(v,i) in gsInforList"
                                                    :key="i"
                                                    :label="v.label"
                                                    :value="v.label"
                                                ></el-option>
                                            </el-select>
                                    </el-form-item>
                                    </el-col>
                                    <el-col :span="12">
                                    <el-form-item label="负责人" prop="userName">
                                        <el-input v-model="formDataTrans.userName" placeholder="请输入负责人" />
                                    </el-form-item>
                                    </el-col>
                                    <el-col :span="12">
                                        <el-form-item label="联系电话" prop="phone">
                                            <el-input v-model="formDataTrans.phone" placeholder="请输入联系电话" />
                                        </el-form-item>
                                    </el-col>
                                    <el-col :span="12">
                                        <el-form-item label="车辆信息" prop="carInfor">
                                            
                                            <el-select class="fillUp" v-model="formDataTrans.carInfor" multiple  clearable placeholder="请选择车辆信息" @change="changecarInfor">
                                                <el-option
                                                    v-for="(v,i) in carInforList"
                                                    :key="i"
                                                    :label="v.label"
                                                    :value="v.label"
                                                ></el-option>
                                            </el-select>
                                        </el-form-item>
                                    </el-col>
                                    <!-- <el-col :span="24">
                                        <el-form-item label="运输路线" prop="transLine">
                                            <el-input v-model="formDataTrans.transLine" placeholder="请输入建设单位" />
                                        </el-form-item>
                                    </el-col> -->
                                </el-row>
                            </el-form>
                            <div slot="footer" class="dialog-footer">
                                <el-button type="primary" @click="submitTrans">确 定</el-button>
                            </div>
                        </el-dialog>
                    </div>
                </div>
                <div class="baAddRightBasic" ref="basic4">
                    <div class="basicCell">
                        <div class="basicCellTitle">附件上传<span class="basicCellTip">(<span style="color: red;">*</span>为必传)</span></div>
                        <el-form ref="formFileList" :rules="rulesBasic" label-width="150px">
                            <el-row>
                                <el-col :span="8">
                                    <div class="fileInfor redBorder">
                                        <div class="fileInforImg">
                                            <img src="@/assets/images/beian/sqb.png" />
                                        </div>
                                        <div class="fileInforTitle"><span class="requiredRed">*</span><span>申请表</span></div>
                                        <div class="fileInforSubtitle">请上传盖章后的建筑垃圾处置申请表</div>
                                        <div class="fileInforUpload">
                                            
                                            <FileUploadBA v-model="formFile.fileInfor1" :limit="1" :fileSize="10" />
                                            <!-- <el-button type="primary" @click="uploadSQB()">上传文件</el-button> -->
                                        </div>
                                        <div class="fileInforList"> </div>
                                    </div>
                                </el-col>
                                <el-col :span="8">
                                    <div class="fileInfor redBorder">
                                        <div class="fileInforImg">
                                            <img src="@/assets/images/beian/pdf.png" />
                                        </div>
                                        <div class="fileInforTitle"><span class="requiredRed">*</span><span>处理方案</span></div>
                                        <div class="fileInforSubtitle">请上传盖章后的建筑垃圾处理方案</div>
                                        <div class="fileInforUpload">
                                            <FileUploadBA v-model="formFile.fileInfor2" :limit="1" :fileSize="10" />
                                            
                                        </div>
                                        <div class="fileInforList"> </div>
                                    </div>
                                </el-col>
                                <el-col :span="8">
                                    <div class="fileInfor redBorder">
                                        <div class="fileInforImg">
                                            <img src="@/assets/images/beian/zj.png" />
                                        </div>
                                        <div class="fileInforTitle"><span class="requiredRed">*</span><span>相关证件</span></div>
                                        <div class="fileInforSubtitle">
                                            <span>请上传身份证、委托人相关等相关证件</span>
                                            <el-popover
                                                placement="right"
                                                width="400"
                                                trigger="click">
                                                <div>    
                                                    <div style="font-size: 14px;font-weight: bold;margin-bottom: 5px;">提示：需上传内容</div>
                                                    <div v-for="(item, i) in xgzjList" :key="i"><span>{{ i+1 }}、</span> <span>{{ item.label }}</span></div>
                                                </div>
                                                <i slot="reference" class="el-icon-question" style="font-size: 16px;"></i>
                                                <!-- <el-button >click 激活</el-button> -->
                                            </el-popover>
                                            <!-- <i class="el-icon-warning"></i> -->
                                        </div>
                                        <div class="fileInforUpload">
                                            <FileUploadBA v-model="formFile.fileInfor3" :limit="5" :fileSize="10" />
                                            <!-- <el-button type="primary" @click="uploadSQB()">上传文件</el-button> -->
                                        </div>
                                        <div class="fileInforList"> </div>
                                    </div>
                                </el-col>
                                <el-col :span="8">
                                    <div class="fileInfor">
                                        <div class="fileInforImg">
                                            <img src="@/assets/images/beian/sqb.png" />
                                        </div>
                                        <div class="fileInforTitle">运输单位意向书</div>
                                        <div class="fileInforSubtitle">请上传盖章后的建筑垃圾处置申请表</div>
                                        <div class="fileInforUpload">
                                            <FileUploadBA v-model="formFile.fileInfor4" :limit="1" :fileSize="10" />
                                            
                                        </div>
                                        <div class="fileInforList"> </div>
                                    </div>
                                </el-col>
                                <el-col :span="8">
                                    <div class="fileInfor">
                                        <div class="fileInforImg">
                                            <img src="@/assets/images/beian/sqb.png" />
                                        </div>
                                        <div class="fileInforTitle">处置单位意向书</div>
                                        <div class="fileInforSubtitle">请上传盖章后的建筑垃圾处置申请表</div>
                                        <div class="fileInforUpload">
                                            <FileUploadBA v-model="formFile.fileInfor5" :limit="1" :fileSize="10" />
                                            
                                        </div>
                                        <div class="fileInforList"> </div>
                                    </div>
                                </el-col>
                                <el-col :span="8">
                                    <div class="fileInfor">
                                        <div class="fileInforImg">
                                            <img src="@/assets/images/beian/sqb.png" />
                                        </div>
                                        <div class="fileInforTitle">其他材料</div>
                                        <div class="fileInforSubtitle">请上传其他相关材料信息</div>
                                        <div class="fileInforUpload">
                                            <FileUploadBA v-model="formFile.fileInfor6" :limit="1" :fileSize="10" />
                                            
                                        </div>
                                        <div class="fileInforList"> </div>
                                    </div>
                                </el-col>
                            </el-row>
                        </el-form>
                        <el-dialog :title="titleFiles" :visible.sync="openFile" width="500px" append-to-body>
                            <el-form ref="formFile" :rules="rulesFile" label-width="100px">
                                <div class="basicSubtitle">文件信息</div>
                                <el-row>
                                    <el-col :span="24">
                                    <el-form-item label="文件名称" prop="name">
                                        <el-select class="fillUp" v-model="formFile.name" clearable placeholder="请选择文件名称">
                                            <el-option v-for="(v,index) in nameFileList" :key="index" :label="v.label" :value="v.value" ></el-option>
                                        </el-select>
                                    </el-form-item>
                                    </el-col>
                                    <el-col :span="24">
                                        <el-form-item label="文件类型" prop="type">
                                        <el-select class="fillUp" v-model="formFile.type" clearable placeholder="请选择文件名称">
                                            <el-option v-for="(v,index) in fileTypeList" :key="index" :label="v.label" :value="v.value" ></el-option>
                                        </el-select>
                                        </el-form-item>
                                    </el-col>
                                    <el-col :span="24">
                                        <el-form-item label="文件上传" prop="fileUrl">
                                           <FileUpload v-model="formFile.fileUrl" :limit="1" :fileSize="10" />
                                        </el-form-item>
                                    </el-col>
                                </el-row>
                            </el-form>
                            <div slot="footer" class="dialog-footer">
                                <el-button type="primary" @click="submitFile">确 定</el-button>
                            </div>
                        </el-dialog>
                    </div>
                </div>
                <div class="baAddRightBtm">
                    <el-button type="primary" @click="saveInfor()">暂存</el-button>
                    <!-- <el-button type="primary" v-if="stepActive != 0" @click="back">上一步</el-button>
                    <el-button type="primary" v-if="stepActive < 3" @click="next">下一步</el-button> -->
                    <el-button type="primary" @click="submit()">提交</el-button>
                </div>
            </div>
        </div>

        <el-dialog title="申报人" :visible.sync="openAddType" width="500px" append-to-body>
            <el-form ref="formJudge" label-width="120px">
                <!-- <div class="basicSubtitle">文件信息</div> -->
                <el-row>
                    <el-col :span="24">
                    <el-form-item label="是否是委托人:" prop="name">
                        <el-radio-group v-model="addType">
                            <el-radio :label="1">工地负责人</el-radio>
                            <el-radio :label="2">代理人</el-radio>
                        </el-radio-group>
                    </el-form-item>
                    </el-col>
                </el-row>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button type="primary" @click="submitAddType">确 定</el-button>
            </div>
        </el-dialog>

    </div>
  </template>
  
  <script>
    
    import { provinceList, cityList, areaList } from "@/api/region/region";

    import { getUserProfile } from "@/api/system/user";

  export default {
    name: "Record",
    components: {  },
    data() {
      return {
        openAddType: true,
        addType: 1,
        stepActive: 1, // 进度
        totalAllCount: null,
        formData: { // 表单数据
            // 基本信息
            name: '', // 工程名称
            type: '', // 工程类别
            xmjb: "", // 项目级别
            provinceCode: '130000', // 省
            provinceName: '河北省', // 市
            cityCode: '', // 市
            cityName: '', // 市
            areaCode: '', // 县
            areaName: '', // 县

            totalAllCount: null,
            residueWeightInfoTotal: null,
            residueWeightInfoTotal2: null,
            residueWeightInfoTotal3: null,
            residueWeightInfoTotal4: null,
            
            residueWeightInfoList: [{ // 工程渣土
                constructionFactoryId: null,
                constructionFactoryName: "",
                disposalType: "SPOT_UTILIZATION",
                disposalTypeDesc: "就地利用",
                weight: null,
            },{
                constructionFactoryId: null,
                constructionFactoryName: "",
                disposalType: "OUTBOUND_DISPOSAL",
                disposalTypeDesc: "外运处置",
                weight: null,
            },{
                constructionFactoryId: null,
                constructionFactoryName: "",
                disposalType: "EARTHWORK_BALANCE",
                disposalTypeDesc: "土方平衡",
                weight: null,
            }],
            residueWeightInfoList2: [{ // 工程渣土
                constructionFactoryId: null,
                constructionFactoryName: "",
                disposalType: "SPOT_UTILIZATION",
                disposalTypeDesc: "就地利用",
                weight: null,
            },{
                constructionFactoryId: null,
                constructionFactoryName: "",
                disposalType: "OUTBOUND_DISPOSAL",
                disposalTypeDesc: "外运处置",
                weight: null,
            }],
            residueWeightInfoList3: [{ // 工程渣土
                constructionFactoryId: null,
                constructionFactoryName: "",
                disposalType: "SPOT_UTILIZATION",
                disposalTypeDesc: "就地利用",
                weight: null,
            },{
                constructionFactoryId: null,
                constructionFactoryName: "",
                disposalType: "OUTBOUND_DISPOSAL",
                disposalTypeDesc: "外运处置",
                weight: null,
            }],
            residueWeightInfoList4: [{ // 工程渣土
                constructionFactoryId: null,
                constructionFactoryName: "",
                disposalType: "SPOT_UTILIZATION",
                disposalTypeDesc: "就地利用",
                weight: null,
            },{
                constructionFactoryId: null,
                constructionFactoryName: "",
                disposalType: "OUTBOUND_DISPOSAL",
                disposalTypeDesc: "外运处置",
                weight: null,
            }],
            tableDataTrans: [], // 
            fileList1: [{
                name: "申请表.pdf",
                size: "125kb",
                url: "",
            }],
            fileList2: [{
                name: "处理方案.pdf",
                size: "125kb",
                url: "",
            }],
            fileList3: [{
                name: "身份证1.jpg",
                size: "125kb",
                url: "",
            },{
                name: "身份证2.jpg",
                size: "125kb",
                url: "",
            }],
            fileList4: [{
                name: "运输单位意向书.pdf",
                size: "125kb",
                url: "http://127.0.0.1:8808/profile/upload/2025/01/22/topc_20250122173618A004.png",
                fileName: "/profile/upload/2025/01/22/topc_20250122173618A004.png",
                msg: "操作成功",
                newFileName: "topc_20250122173618A004.png",
                originalFilename: "topc.png",
            }],
            fileList5: [{
                name: "运输单位意向书.pdf",
                size: "125kb",
                url: "http://127.0.0.1:8808/profile/upload/2025/01/22/profile_20250122173625A005.jpg",
                fileName: "/profile/upload/2025/01/22/profile_20250122173625A005.jpg",
                msg: "操作成功",
                newFileName: "profile_20250122173625A005.jpg",
                originalFilename: "profile.jpg",
            }],
            fileList6: [{
                name: "运输单位意向书.pdf",
                size: "125kb",
                url: "http://127.0.0.1:8808/profile/upload/2025/01/22/profile_20250122170435A003.jpg",
                fileName: "/profile/upload/2025/01/22/profile_20250122170435A003.jpg",
                msg: "操作成功",
                newFileName: "profile_20250122170435A003.jpg",
                originalFilename: "profile.jpg",
            }],
        }, 
        rulesBasic: { // 校验
            name: [ // 工程名称
                { required: true, trigger: "blur", message: "请输入" },
            ],
            typeGC: [ // 工程类别
                { required: true, trigger: "change", message: "请选择" }
            ],
            sgdw: [ // 施工单位
                { required: true, trigger: "blur", message: "请输入" }
            ],
            dwlx: [ // 单位类型
                { required: true, trigger: "change", message: "请选择" }
            ],
            dwmc: [ // 单位名称
                { required: true, trigger: "blur", message: "请输入" }
            ],
            dwfzr: [ // 负责人
                { required: true, trigger: "blur", message: "请输入" }
            ],
            dwfzrdh: [ // 联系电话
                { required: true, trigger: "blur", message: "请输入" },
                { pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/, message: "请输入正确的手机号码", trigger: "blur" },
            ],
        },
        cityList: [
            // { cityCode: "130100",cityName: "石家庄市" },
            // { cityCode: "130200",cityName: "唐山市" },
            // { cityCode: "130300",cityName: "秦皇岛市" },
            // { cityCode: "130400",cityName: "邯郸市" },
            // { cityCode: "130500",cityName: "邢台市" },
            // { cityCode: "130600",cityName: "保定市" },
            // { cityCode: "130700",cityName: "张家口市" },
            // { cityCode: "130800",cityName: "唐山市" },
        ], 
        areaList: [
            // { areaCode: "130101",areaName: "长安区" },
            // { areaCode: "130102",areaName: "桥西区" },
            // { areaCode: "130103",areaName: "新华区" },
            // { areaCode: "130104",areaName: "井陉矿区" },
            // { areaCode: "130105",areaName: "裕华区" },
            // { areaCode: "130106",areaName: "井陉县" },
            // { areaCode: "130107",areaName: "正定县" },
        ],
        // 房屋建设，市政工程，交通工程，水利工程，装饰装修工程，拆除工程
        typeList: [{
            value: "1",
            label: "房屋建设"
        },{
            value: "2",
            label: "市政工程"
        },{
            value: "3",
            label: "交通工程"
        }],
        xmjbList: [{
            value: "1",
            label: "区级"
        },{
            value: "2",
            label: "市级"
        }],
        // 建筑垃圾处理方案 ===================================
        rulesWeightInfo: {
            totalAllCount: [ // 总重
                { required: true, trigger: "blur", message: "请输入" },
                { pattern: /^\d+.?\d{0,2}$/, message: "保留小数点后两位", trigger: "blur" }

            ],
            weight: [
                // { required: true, trigger: "blur", message: "请输入" },
                { pattern: /^\d+.?\d{0,2}$/, message: "保留小数点后两位", trigger: "blur" }
            ],
            constructionFactoryId: [
                // { required: true, trigger: "change", message: "请选择" },
            ]
        },
        // 渣土类型
        disposalTypeList: [{ // 
            label: "就地利用", value: "SPOT_UTILIZATION",
            label: "外运处置", value: "OUTBOUND_DISPOSAL",
            label: "土方平衡", value: "EARTHWORK_BALANCE",
        }],
        placeList: [
            {value: '1', label: '河北金吉御建材制造有限公司'},
            {value: '2', label: '保定君益诚环保科技有限公司'},
            {value: '3', label: '建筑垃圾综合再利用生产线'},
            {value: '4', label: '就地利用地定州安路固废处理有限公司新建年处理建筑垃圾80万吨建设项目点6'},
            {value: '5', label: '河北中天骏达环保科技有限公司固体废弃物再生资源节能环保综合利用项目'},
            {value: '6', label: '河北节源固体废弃物治理有限公司年处理80万吨建筑垃圾建设项目'}
        ],
        // 运输公司字段信息 ====================
        titleTrans: '', // 弹窗标题
        openTrans: false, // 
        formDataTrans: { },
        carInforList: [{
            value: '1',
            label: "冀A00744D"
        },{
            value: '2',
            label: "冀A00325D"
        },{
            value: '3',
            label: "冀A08374D"
        },{ 
            value: '4',
            label: "冀A32317D"
        },{
            value: '5',
            label: "冀A32850D"
        },{
            value: '6',
            label: "冀A30831D"
        },{
            value: '7',
            label: "冀A31625D"
        }], // 
        rulesTrans: {
            nameGS: [ // 运输公司名称
                { required: true, trigger: "change", message: "请输入" },
            ],
            userName: [ // 负责人
                { required: true, trigger: "blur", message: "请输入" },
            ],
            phone: [ // 联系电话
                { required: true, trigger: "blur", message: "请输入" },
                { pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/, message: "请输入正确的手机号码", trigger: "blur" },
            ],
            carInfor: [ // 车辆信息
                { required: true, trigger: "change", message: "请输入" },
            ],
        },
        indexTrans: '',
        gsInforList: [{
            value: '1',
            label: "河北云海货物运输有限公司"
        },{
            value: '2',
            label: "河北隆裕建筑工程有限公司"
        },{
            value: '3',
            label: "河北汉道路桥工程有限公司"
        },{
            value: '4',
            label: "河北炬增土石方工程有限公司"
        }],

        // 文件上传
        xgzjList: [
            {label: "身份证正反面扫描件或照片", value: '1'},
            {label: "委托人身份证正反面描件或照片", value: '2'},
            {label: "营业执照扫描件，确保清晰可见", value: '3'},
            {label: "如为代理申请，请上传委托书", value: '4'},
        ],
        fileTypeList: [
            { label: '文件', value: '1' },
            { label: '图片', value: '2' }
        ],
        formFile: {
            fileInfor1: '',
            fileInfor2: '',
            fileInfor3: '',
            fileInfor4: '',
            fileInfor5: '',
            fileInfor6: '',
        },
        nameFileList: [
            { label: '申请表', value: '1' },
            { label: '建筑垃圾处理方案', value: '2' },
            { label: '相关证件', value: '3' },
            { label: '运输单位委托意向书', value: '4' },
            { label: '处置单位委托意向书', value: '5' },
            { label: '相关材料', value: '6' },
        ],
        titleFiles: "上传文件",
        openFile: false, // 弹窗显示隐藏
        formFile: {
            name: '', // 文件名称
            type: null, // 文件类型
            fileUrl: null, // 上传地址
        },
        rulesFile: [],
        isRequired: true,
      };
    },
    created() {
        // 
    },
    mounted() {
        this.initCityList(this.formData.provinceCode)
        this.$refs.basicAll.addEventListener('scroll', this.handleScroll);
    },
    computed: {
        residueWeightInfoTotal() {
                let countNum = 0
                for(let i=0; i<this.formData.residueWeightInfoList.length; i++){
                    
                    countNum = countNum + Number(this.formData.residueWeightInfoList[i].weight)
                }
                return countNum
        },
        residueWeightInfoTotal2() {
                let countNum = 0
                for(let i=0; i<this.formData.residueWeightInfoList2.length; i++){
                    
                    countNum = countNum + Number(this.formData.residueWeightInfoList2[i].weight)
                }
                return countNum
        },
        residueWeightInfoTotal3() {
                let countNum = 0
                for(let i=0; i<this.formData.residueWeightInfoList3.length; i++){
                    
                    countNum = countNum + Number(this.formData.residueWeightInfoList3[i].weight)
                }
                return countNum
        },
        residueWeightInfoTotal4() {
                let countNum = 0
                for(let i=0; i<this.formData.residueWeightInfoList4.length; i++){
                    
                    countNum = countNum + Number(this.formData.residueWeightInfoList4[i].weight)
                }
                return countNum
        },
        totalAll() {
            return this.residueWeightInfoTotal + this.residueWeightInfoTotal2 + this.residueWeightInfoTotal3 + this.residueWeightInfoTotal4
        }
    },
    watch: {
        residueWeightInfoTotal(val){
            this.formData.residueWeightInfoTotal = val
        },
        residueWeightInfoTotal2(val){
            this.formData.residueWeightInfoTotal2 = val
        },
        residueWeightInfoTotal3(val){
            this.formData.residueWeightInfoTotal3 = val
        },
        residueWeightInfoTotal4(val){
            this.formData.residueWeightInfoTotal4 = val
        },
        totalAll(val){
            this.totalAllCount = val
        },
    },
    methods: {
        handleScroll(val){
            const scrollContainer = this.$refs.basicAll.offsetTop;
            const scrollHeight =  this.$refs.basicAll.scrollTop
            const scrollBasic1 = this.$refs.basic1.offsetTop - scrollContainer;
            const scrollBasic2 = this.$refs.basic2.offsetTop - scrollContainer;
            const scrollBasic3 = this.$refs.basic3.offsetTop - scrollContainer;
            const scrollBasic4 = this.$refs.basic4.offsetTop - scrollContainer;
            // console.log(scrollContainer)
            // console.log(scrollBasic1, 'scrollBasic1')
            // console.log(scrollBasic2, 'scrollBasic2')
            // console.log(scrollBasic3, 'scrollBasic3')
            // console.log(scrollBasic4, 'scrollBasic4')
            if(scrollHeight < scrollBasic2) {
                this.stepActive = 1
            } else if(scrollHeight > scrollBasic2 && scrollHeight < scrollBasic3) {
                this.stepActive = 2
            } else if(scrollHeight > scrollBasic3 && scrollHeight < scrollBasic4) {
                this.stepActive = 3
            } else if(scrollHeight > scrollBasic4) {
                this.stepActive = 4
            }
        },
        changecarInfor(val){
            console.log(val,'11', this.formDataTrans.carInfor)
        },
        initCityList(v) {
            let obj = {
                provinceCode: v
            };
            cityList(obj).then(response => {
                this.cityList = response.data;
            });
        },
        //城市选择的
        initAreaList(val) {
            // return
            this.areaList = []
            if(val){
                let obj = {
                    cityCode: val
                };
                areaList(obj).then(response => {
                    this.areaList = response.data;
                });
            }

            this.formData.areaCode = []


        },
        // 基本信息
        scrollCS(val, index){
            this.stepActive = index
            const targetElement = this.$refs[val];
            const scrollContainer = this.$refs.basicAll;
            // 计算滚动位置（这里简单设置为滚动到目标元素的顶部）
            const scrollPosition = targetElement.offsetTop - scrollContainer.offsetTop;
            
            // 滚动到指定位置
            scrollContainer.scrollTop = scrollPosition;
        },
        next(){
            this.stepActive ++ 
            
            // let name = 'basic' + (this.stepActive+1)
            // this.scrollCS(name)
        },
        back(){
            this.stepActive --
            
            // let name = 'basic' + (this.stepActive)
            // this.scrollCS(name)
        },
        // 建筑垃圾处理方案 =======================
        addResidue(val, index, keyVul){
            // return
            let itemData = {
                // constructionFactoryId: null,
                // constructionFactoryName: "",
                // disposalType: "",
                // disposalTypeDesc: "",
                // weight: null,
            }
            itemData.disposalType = val.disposalType
            itemData.disposalTypeDesc = val.disposalTypeDesc
            this.formData[keyVul].push(itemData)
        },
        delResidue(val, index, keyVul) {
            this.formData[keyVul].splice(index, 1);
        },
        aa(){
            this.$refs.formWeightInfo.validate(valid => {
                if (valid) {
                    alert('submit!');
                } else {
                    console.log('error submit!!');
                    return false;
                }
            });
        },
        // 运输管理措施方法------------------
        // 添加
        addTrans(){
            this.titleTrans = '新增运输公司信息';
            this.openTrans = true
            this.indexTrans = null
            this.formDataTrans = {
                nameGS: '',
                userName: '',
                phone: '',
                carInfor: [],
                transLine: null,
            }
            this.$nextTick(() => {
                this.$refs.formCompany.resetFields();
            })
            
        },
        // 修改
        updateTrans(val, index){
            this.titleTrans = '修改运输公司信息';
            this.openTrans = true
            this.indexTrans = index
            let valForm = JSON.stringify(val)
            this.formDataTrans = JSON.parse(valForm)
            // this.$refs.formCompany.resetFields();
        },
        // 删除
        deleteTrans(val, index){
            this.formData.tableDataTrans.splice(index, 1);
        },
        closeTrans(){
            this.$confirm('确认关闭？')
          .then(_ => {
            this.openTrans = false
            done();
          })
          .catch(_ => {});
        },
        submitTrans(){
            let judge = true
            this.$refs.formCompany.validate((valid) => {
                if (valid) {
                    console.log('运输公司信息填报!');
                } else {
                    judge = false
                    console.log('运输公司信息填报');
                    return false;
                }
            });
            if (!judge) {
                // this.$message({
                //     type: 'warning',
                //     message: '请填写运输公司信息!'
                // });
                return
            }
            let that = this
            console.log(this.indexTrans)
            if(this.indexTrans || this.indexTrans == 0) {
                that.formData.tableDataTrans.splice(this.indexTrans, 1, that.formDataTrans);
            } else {
                that.formData.tableDataTrans.push(this.formDataTrans)
            }
            console.log(that.formData.tableDataTrans)
            
            this.openTrans = false
        },
        // ======================
        // 文件上传 =========================
        uploadSQB(){
            this.openFile = true
        },
        submitFile(){
            this.openFile = false
        },
        submitAddType(){
            let that = this
            this.openAddType = false
            console.log(this.addType)
            if(this.addType == 1){
                getUserProfile().then(response => {
                    // this.user = response.data;
                    // console.log(response.data)
                    that.formData.sqr = response.data.nickName
                    that.formData.sqrlxdh = response.data.phonenumber
                    console.log(this.formData)
                });
            }
            console.log(this.$store.state.user, this.$store.state)
        },

        // 暂存 =======================
        saveInfor(){},

        // 提交
        submit(){
            let judge = true
            this.$refs.formBasic.validate((valid) => {
                if (valid) {
                    console.log('基础信息填报!');
                } else {
                    judge=false
                console.log('基础信息填报');
                return false;
                }
            });
            if(!judge) {
                this.scrollCS('basic1', 1)
                this.$message({
                    type: 'warning',
                    message: '请填写基本信息!'
                });
                return
            }
            this.$refs.formWeightInfo.validate((valid) => {
                if (valid) {
                    console.log('建筑垃圾处理方案!');
                } else {
                    judge=false
                    console.log('建筑垃圾处理方案');
                    return false;
                }
            });
            if(!judge) {
                this.scrollCS('basic2', 2)
                this.$message({
                    type: 'warning',
                    message: '请填写建筑垃圾处理方案信息!'
                });
                return
            }
            // 运输管理措施校验 ==================================================================== 
            if(this.formData.tableDataTrans.length<=0){
                this.$message({
                    type: 'warning',
                    message: '请填写运输管理措施信息!'
                });
                this.scrollCS('basic3', 3)
                return
            }
            // 附件上传校验 ==================================================================== 
            // if(!this.checkFile()){
            //     this.scrollCS('basic4', 4)
            //     return
            // }
            this.$message({
                    type: 'success',
                    message: '提交成功!'
                });
            // this.$router.replace({
            //     path: '/record/index',
            // })
            return
            // 提示框
            this.$confirm('备案信息提交后不可修改, 是否继续?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                this.$message({
                    type: 'success',
                    message: '提交成功!'
                });
            }).catch(() => {
                this.$message({
                    type: 'info',
                    message: '已取消'
                });          
            });
        },
        // 判断文件是否上传
        checkFile(){
            
            if(!this.formFile.fileInfor1 || this.formFile.fileInfor1.length<=0){ // 申请表
                console.log(1160)
                this.$message({
                    type: 'warning',
                    message: '请上传申请表信息!'
                });
                return false
            } else if(!this.formFile.fileInfor2 || this.formFile.fileInfor2.length<=0){ // 处理方案
                console.log(1167)
                this.$message({
                    type: 'warning',
                    message: '请上传处理方案信息!'
                });
                return false
            } else if(!this.formFile.fileInfor3 || this.formFile.fileInfor3.length<=0){ // 相关证件
                console.log(1174)
                this.$message({
                    type: 'warning',
                    message: '请上传相关证件信息!'
                });
                return false
            } else {
                console.log(1181)
                return true
            }
        },
    }
  };
  </script>
  
  <style scoped lang="scss" >
    .app-container{
       .baAdd{
        display: flex;
        .baAddLeft{
            width: 200px;
            max-height: 350px;
            .baAddSteps{
                font-size: 18px;
                // font-weight: bold;
                color: #666;
                .baAddStep{
                    padding: 10px 0;
                }
                .isActive{
                    font-size: 18px;
                    font-weight: bold;
                    color: #409eff;
                }
            }
        }
        .baAddRight{
            width: calc(100% - 200px);
            font-size: 14px;
            font-weight: 500;
            line-height: 20px;
            letter-spacing: 0px;
            height: calc(100vh - 150px);
            overflow: auto;
            padding-right: 10px;

            .baAddRightBasic{
                padding-bottom: 30px;
                .el-date-editor{
                    width: 100%;
                }
                .basicCellTitle{
                    font-size: 24px;
                    font-weight: bold;
                    line-height: 32px;
                    padding: 10px 0;
                    .basicCellTip{
                        font-size: 14px;
                        color: #666666;
                    }
                }
                .basicSubtitle{
                    font-size: 18px;
                    font-weight: 600;
                    line-height: 28px;
                    letter-spacing: 0px;
                    padding: 10px 0;
                }
                .basicFence{
                    width: 100%;
                    min-height: 300px;
                    border: 1px solid;
                    border-radius: 5px;
                }
            }

            .el-select{
                width: 100%;
            }
            .baAddRightBtm{
                position: fixed;
                bottom: 0;
                width: 100%;
                width: calc(100% - 230px);
                text-align: center;
                height: 50px;
                background-color: white;
                padding-top: 10px;
                box-shadow: 0 -5px 10px rgba(0, 0, 0, 0.5);
            }

            .redBorder{
                // border-color: red !important;
            }
            
            .fileInfor{
                border-radius: 8px;
                box-sizing: border-box;
                border: 1px dashed #D1D5DB;
                min-height: 200px;
                margin: 10px;
                padding: 10px;
                display: flex;
                flex-direction: column;
                justify-content: center;
                align-items: center;
                .requiredRed{
                    color: red;
                    font-size: 24px;
                    margin-right: 10px;
                }
                .fileInforImg{
                    /* 自动布局子元素 */
                    width: 48px;
                    height: 48px;
                    border-radius: 9999px;

                    /* 自动布局 */
                    display: flex;
                    flex-direction: row;
                    justify-content: center;
                    align-items: center;
                    padding: 0px;
                    gap: 0px 0px;
                    flex-wrap: wrap;
                    align-content: center;

                    background: #EFF6FF;
                }
                .fileInforTitle{
                    margin-top: 10px;
                    font-size: 16px;
                    font-weight: 500;
                    line-height: 24px;
                    color: #111827;

                }
                .fileInforSubtitle{
                    margin-top: 10px;
                    font-size: 14px;
                    font-weight: normal;
                    line-height: 20px;
                    color: #6B7280;
                }
                .fileInforUpload{
                    margin-top: 10px;

                }
            }
            .cll{
                .cllSpan{
                    width: 350px;
                    font-size: 16px;
                    font-weight: normal;
                    line-height: 24px;
                    letter-spacing: 0px;
                    color: #6B7280;
                }
                .el-input{
                    margin-left: 20px;
                    width: calc(100% - 340px);
                }
            }
        }
       } 
    }
    .alertForm{
        .el-select{
            width: 100%;
        }
    }
  </style>